<template lang="html">
	<div class="boutique_box">
		<div class="boutique_url">
			<router-link class="boutique_link" to="/boutiquemain">
				<span>品牌专区</span>
				<i>更多</i>
			</router-link>
		</div>
		<div class="boutique_main_box">
			<ul class="boutique_mian">
				<li class="boutique"  v-for="(item, index) in boutiqueshuju">
					<router-link class="boutique_del" :to="{path:'/boutiquedetails',query:{id:item.id}}">
						<img :src="item.thumb" :alt="item.title">
					</router-link>
				</li>
			</ul>
		</div>
	</div>
</template>
<script type="text/javascript">
	
	export default {
		props:["boutiqueshuju"],
	  data(){
	  	return{}
	  },
	  methods:{
	    
	  },
	  components:{

	  }
	}
</script>
<style type="text/css" lang="less">
	@import '../../../assets/less/index.less';
	.boutique_box{
		width: 100vw;
		border-bottom: solid 2vw @colcr4;
		.boutique_url{
			width: 100%;
			border-bottom: solid 1px @colcr4;
			.boutique_link{
				display: inline-block;
				width: @width;
				margin: 0 auto;
				height: 11vw;
				line-height: 11vw;
				font-size: @h1_font_size;
				span{
					display: inline-block;
					float: left;
				}
				i{
					float: right;
				}
			}
		}
		.boutique_mian{
			width: 100vw;
			margin: 0 auto;
			.boutique{
				width: 100%;
				display: block;
				border-bottom: solid 0.5vw @color1;
				.boutique_del{
					width: 100%;
					display: block;
					height: 30.666vw;
					img{
						width: 100%;
						height: 30.666vw;
					}
				}
				&:last-child{
					border-bottom: solid 0vw @color1;
				}
			}
		}
	}
</style>